<template>
  <div class="total-wraper" v-loading="loading">
    <div class="mask" v-show="showMask" @click="showMask=false"></div>
    <div class="big-image" v-show="showMask" @click="showMask=false">
      <img :src="bigImageUrl"
           style="width:800px;minHeight:600px;borderRadius:20px"
           alt=""></div>
    <div class="verify-outwraper">
      <!--home-->
      <span class="nav-bar" @click="$router.push('verificationIndex')">Home</span>
      <!--仅当ad status 为reported（8）时显示-->
      <section class="reported-area" v-if="status==8">
        <div>
          <p class="reported-title">Reported problems</p>
          <p v-for="item in reportedReason" class="reported-by">{{item}}</p>
        </div>
        <div>
          <p class="reported-title">Reported by</p>
          <p class="reported-by">{{reportedBy}}</p>
        </div>
        <div>
          <p class="reported-title">Reported date</p>
          <p class="reported-date">{{reportedDate}} ({{reportedDiffTime}})</p>
        </div>
      </section>
      <!--图片-->
      <div class="image-wraper">
        <div class="image-box">
          <img :src="showPhoto[0].url" style="width:120px;height:120px;borderRadius:10px" v-if="showPhoto[0].url"
               @click="showBigImage(showPhoto[0].url)"/>
        </div>
        <div class="image-box">
          <img :src="showPhoto[1].url" style="width:120px;height:120px;borderRadius:10px" v-if="showPhoto[1].url"
               @click="showBigImage(showPhoto[1].url)"/>
        </div>
        <div class="image-box">
          <img :src="showPhoto[2].url" style="width:120px;height:120px;borderRadius:10px" v-if="showPhoto[2].url"
               @click="showBigImage(showPhoto[2].url)"/>
        </div>
        <div class="image-box">
          <img :src="showPhoto[3].url" style="width:120px;height:120px;borderRadius:10px" v-if="showPhoto[3].url"
               @click="showBigImage(showPhoto[3].url)"/>
        </div>
        <div class="image-box">
          <img :src="showPhoto[4].url" style="width:120px;height:120px;borderRadius:10px" v-if="showPhoto[4].url"
               @click="showBigImage(showPhoto[4].url)"/>
        </div>
        <div class="image-box">
          <img :src="showPhoto[5].url" style="width:120px;height:120px;borderRadius:10px" v-if="showPhoto[5].url"
               @click="showBigImage(showPhoto[5].url)"/>
        </div>
        <div class="image-box">
          <img :src="showPhoto[6].url" style="width:120px;height:120px;borderRadius:10px" v-if="showPhoto[6].url"
               @click="showBigImage(showPhoto[6].url)"/>
        </div>
        <div class="image-box">
          <img :src="showPhoto[7].url" style="width:120px;height:120px;borderRadius:10px" v-if="showPhoto[7].url"
               @click="showBigImage(showPhoto[7].url)"/>
        </div>
      </div>
      <!--标题-->
      <div class="menu-row">
        <!--<span class="menu-title">Ad Title</span>-->
        <span class="menu-data-title">{{formData.title}}</span>
      </div>
      <!--价格-->
      <div class="menu-row">
        <span class="menu-price">{{formData.priceType}}</span>
        <span class="menu-data-price">{{formData.price}}</span>
        <span class="menu-data-date">{{formData.date}}</span>
      </div>
      <!--状况-->
      <div class="menu-row">
        <span class="menu">Condition</span>
        <span class="menu-data">{{formData.condition}}</span>
      </div>
      <!--商标-->
      <div class="menu-row" v-if="formData.brand">
        <span class="menu">Brand</span>
        <span class="menu-data">{{formData.brand}}</span>
      </div>
      <!--菜单目录-->
      <div v-if="formData.firstCategory" class="menu-row">
        <span class="menu">Category</span>
        <span class="menu-data">{{formData.firstCategory}}</span>
      </div>
      <div v-if="formData.secondaryCategory" class="menu-row">
        <span class="menu-data-category">{{formData.secondaryCategory}}</span>
      </div>
      <div v-if="formData.thirdCategory" class="menu-row">
        <span class="menu-data-category">{{formData.thirdCategory}}</span>
      </div>
      <!--位置-->
      <div class="menu-row">
        <span class="menu">Location</span>
        <span class="menu-data">{{formData.regionText}}-{{formData.townshipText}}</span>
      </div>
      <!--显示详情信息-->
      <div v-if="propertyData.length>0">
        <div v-for="item in propertyData" :key="item.id" class="menu-row" v-if="item.name!=='Brand'">
          <span class="menu">{{item.name}}</span>
          <span class="menu-data">{{otherForm[item.id]}}</span>
        </div>
      </div>
      <!--ad描述-->
      <div class="menu-row">
        <span class="menu">Description</span>
        <span class="menu-data-desc">{{formData.adDescription}}</span>
      </div>
      <hr/>
      <!--用户名-->
      <div class="menu-row">
        <span class="menu">User Name</span>
        <span class="menu-data">{{formData.userName}}</span>
      </div>
      <!--用户描述-->
      <div class="menu-row">
        <span class="menu">Description</span>
        <span class="menu-data-desc">{{formData.userDescription}}</span>
      </div>
      <hr/>
      <p>Verify if this ad follows rules</p>
      <el-button type="success" @click="approve">Approve</el-button>
      <hr/>
      <el-form label-position="top" :rules="reasonRules" :model="uploadForm" ref="ruleForm" size="mini">
        <el-form-item label="Reject reason" prop="reasonArr">
          <div>
            <el-checkbox-group v-model="uploadForm.reasonArr">
              <el-checkbox label="Title" name="type" style="margin-right: 30px">Title</el-checkbox>
              <el-checkbox label="Photo" name="type">Photo</el-checkbox>
              <el-checkbox label="Price" name="type">Price</el-checkbox>
              <el-checkbox label="Description" name="type">Description</el-checkbox>
              <el-checkbox label="Brand" name="type">Brand</el-checkbox>
              <el-checkbox label="Duplicate" name="type">Duplicate</el-checkbox>
              <div class="other" style="width: 300px">
                <!--勾选other 上传一个空字符串-->
                <el-checkbox label="" name="type" @change="ifHaveOther=!ifHaveOther">Others</el-checkbox>
                <el-input
                  type="textarea"
                  :rows="2"
                  placeholder=""
                  v-model="uploadForm.notes"
                  v-if="ifHaveOther">
                </el-input>
              </div>
            </el-checkbox-group>
          </div>
        </el-form-item>
        <el-button type="danger" @click="reject">Reject</el-button>
      </el-form>
      <hr/>
      <p>Higher level to decide</p>
      <el-button type="info" @click="notSure">Not Sure</el-button>
      <hr/>
      <!--Ad update log 日志-->
      <div class="verify-table">
        <el-table
          :data="tableData"
          v-loading="tableLoading"
          border
          style="width: 100%">
          <!--Ad Status-->
          <el-table-column
            prop="id"
            label="Ad Status"
            align="center"
            min-width="80">
          </el-table-column>
          <!--Verification Status-->
          <el-table-column
            prop="name"
            label="Verification Status"
            align="center"
            min-width="100">
          </el-table-column>
          <!--Updated Date-->
          <el-table-column
            prop="name"
            label="Updated Date"
            align="center"
            min-width="100">
          </el-table-column>
          <!--Updated By-->
          <el-table-column
            prop="account"
            label="Updated By"
            align="center"
            min-width="150">
          </el-table-column>
        </el-table>
        <!--分页-->
        <div class="block" style="margin-top: 15px;text-align: center;">
          <el-pagination
            @size-change="handleChangeSize"
            @current-change="handleChangePage"
            :current-page="pageData.pageNum"
            :page-size="pageData.pageSize"
            :page-sizes="[10, 20, 50, 100, 500]"
            :page-count="pageInfo.totalPages"
            :total="pageInfo.totalCount"
            layout="total, prev, pager, next, jumper, sizes">
          </el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import {getVerifyData, verifyApprove, verifyNotSure, verifyReject, getVerifyDataById} from '../../api/guc_api.js';
  import qs from 'qs';
  import regions from '@/json/region';
  import townships from '@/json/township';
  import categoryData from '@/json/category.json';

  export default {
    name: 'verify',
    data() {
      return {
        //本地数据
        regions,
        townships,
        categoryData,
        showPhoto: [
          {url: '', id: ''},
          {url: '', id: ''},
          {url: '', id: ''},
          {url: '', id: ''},
          {url: '', id: ''},
          {url: '', id: ''},
          {url: '', id: ''},
          {url: '', id: ''},
        ],
        //规格数据
        propertyData: [],
        otherForm: {},
        formData: {
          title: '',
          priceType: '',
          price: '',
          // 日期
          date: '',
          condition: '',
          brand: '',
          //分类数据
          firstCategory: '',
          secondaryCategory: '',
          thirdCategory: '',
          //区域数据
          regionId: '',
          townshipId: '',
          regionText:'',
          townshipText:'',
          adDescription: '',
          userName: '',
          userDescription: ''
        },
        //reject reason 校验规则
        reasonRules: {
          reasonArr: [
            {type: 'array', required: true, message: 'Please Select', trigger: 'change'}
          ],
        },
        //reject 需要上传的表单数据
        uploadForm: {
          reasonArr: [],
          notes: '',
        },
        //控制是否显示other输入框
        ifHaveOther: false,
        tableLoading: false,
        //表格分页
        tableData: [],
        pageData: {
          pageNum: 1,
          pageSize: 10,
        },
        pageInfo: {
          totalCount: 0,
          totalPages: 0
        },
        //商品id
        adID: '',
        //ad 状态
        status: '',
        //用来表示是哪种审核
        verificationStatus: '',
        //显示大图
        showMask: false,
        bigImageUrl: '',
        //局部加载动画
        loading: false,
        //举报数据
        reportedBy: '',
        reportedDate: '',
        reportedDiffTime: '',
        reportedReason: [],
      }
    },
    methods: {
      //错误提示信息
      messageToastErr(msg) {
        this.$message({
          showClose: true,
          message: msg,
          duration: 5000,
          type: 'error'
        })
      },
      //成功消息提示
      messageToastSuccess(msg) {
        this.$message({
          showClose: true,
          message: msg,
          duration: 5000,
          type: 'success'
        })
      },
      //警告消息提示
      messageToastWarning(msg) {
        this.$message({
          showClose: true,
          message: msg,
          type: 'warning'
        });
      },
      //分页控制
      handleChangeSize(val) {
        this.pageData.pageSize = parseInt(val)
        this.pageData.pageNum = 1
        this.getList()
      },
      handleChangePage(val) {
        this.pageData.pageNum = val
        this.getList()
      },
      //拿到regionId和townshipId后转换成text
      getRegion(id) {
        let region = ''
        if (id) {
          this.regions.forEach(item => {
            if (item.value == id) {
              region = item.text
            }
          })
        }
        return region
      },
      getTownship(id) {
        let township = ''
        if (id) {
          this.townships.forEach(item => {
            if (item.value == id) {
              township = item.text
            }
          })
        }
        return township
      },
      //初始化
      initForm() {
        this.loading = true
        let params = {
          status: this.status,
          verificationStatus: this.verificationStatus
        }
        getVerifyData(params).then(res => {
          this.loading = false
          // 拿到新数据后页面置顶
          window.scrollTo(0, 0);
          if (res.data.errorID === 0) {
            let data = res.data.object.list[0]
            //图片初始化
            //需要把showPhoto置空 否则data.images里没有的图片在showphoto里会继续存在
            this.showPhoto = [
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
            ],
              data.images.forEach(item => {
                this.showPhoto[item.sequence].url = item.url
              })
            this.formData.title = this.$translateLang(data.title || '', 'unicodeTozawgyi') || ''
            //价格初始化
            this.formData.price = data.price ? this.regexNum(data.price) : ''
            this.formData.priceType = data.priceType === 1 ? 'Kyat' : 'Lakh'
            //举报内容初始化
            this.reportedBy = data.reportedBy || ''
            this.reportedDiffTime = data.reportedDate ? this.getDateDiff(data.reportedDate) : ''
            this.reportedDate = data.reportedDate ? this.dateFormat(data.reportedDate) : ''
            if (data.reportedProblems) {
              let temparr = data.reportedProblems.split(',')
              //最后一项如果时空字符串就去掉
              if (temparr[temparr.length - 1] == '') {
                temparr.pop()
              }
              let finalArr = []
              if (temparr.indexOf('wrong_category') != -1) {
                finalArr.push('Wrong category')
              }
              if (temparr.indexOf('wrong_descriprtion') != -1) {
                finalArr.push('Wrong description')
              }
              if (temparr.indexOf('wrong_picture') != -1) {
                finalArr.push('Wrong picture')
              }
              if (temparr.indexOf('price_is_different_from_listing') != -1) {
                finalArr.push('Price is different from listing')
              }
              if (temparr.indexOf('duplicate_post') != -1) {
                finalArr.push('Duplicate Ad')
              }
              if (temparr.indexOf('prohibited_item') != -1) {
                finalArr.push('Prohibited item')
              }
              if (temparr.indexOf('counterfeit_item') != -1) {
                finalArr.push('Counterfeit item')
              }
              if (temparr.indexOf('no_longer_available') != -1) {
                finalArr.push('Item no longer available')
              }
              if (temparr.indexOf('unresponsive_poster') != -1) {
                finalArr.push('Unresponsive poster')
              }
              if (temparr.indexOf('scam') != -1) {
                finalArr.push('Scam')
              }
              this.reportedReason = finalArr
            }
            //如果有其他原因的话 也放入这个数组
            if (data.otherReason) {
              this.reportedReason.push(data.otherReason)
            }
            //日期初始化
            this.formData.date = this.getDateDiff(data.createDatetime)
            this.formData.condition = data.condition === 0 ? 'New' : 'Used'
            this.formData.brand = data.brand
            this.formData.adDescription = this.$translateLang(data.desc || '', 'unicodeTozawgyi') || ''
            //分类初始化
            let categoryName = data.category.categoryName
            let categoryArr = categoryName.split('/')
            this.formData.firstCategory = categoryArr[0] || ''
            this.formData.secondaryCategory = categoryArr[1] || ''
            this.formData.thirdCategory = categoryArr[2] || ''
            //区域初始化
            this.formData.regionId = data.regionId
            this.formData.regionText=this.getRegion(data.regionId)
            this.formData.townshipId = data.townshipId
            this.formData.townshipText=this.getTownship(data.townshipId)
            //规格初始化
            this.getPropertyData(data.categoryId)
            data.values.forEach(item => {
              this.otherForm[item.propertyId] = this.$translateLang(item.text || '', 'unicodeTozawgyi') || ''
            })
            //用户信息初始化
            this.formData.userName = this.$translateLang(data.sellerInfo.name || '', 'unicodeTozawgyi') || ''
            this.formData.userDescription = this.$translateLang(data.sellerInfo.description || '', 'unicodeTozawgyi') || ''
            //id初始化
            this.adID = data.id
            //初始化reject表单
            this.uploadForm = {
              reasonArr: [],
              notes: '',
            }
          }
          else {
            //后台说只有可能返回no data的错误 需求说不需要显示nodata的错误信息  所以错误的toast就不要了 直接进行页面跳转
            // this.messageToastWarning(res.data.message)
            if (this.goodsId) {
              this.$router.replace('shopAdIndex')
            }
            else {
              this.$router.replace('verificationIndex')
            }
          }
        })
          .catch(error => {
            this.loading = false
            console.log(error)
          })
      },
      //时间格式化
      getDateDiff(dateTimeStamp) {
        if (!dateTimeStamp) return
        let minute = 1000 * 60
        let hour = minute * 60
        let day = hour * 24
        let month = day * 30
        let year = day * 365
        let now = new Date().getTime()
        let diffValue = now - dateTimeStamp
        if (diffValue < 0) return
        let monthC = diffValue / month
        let yearC = diffValue / year
        let weekC = diffValue / (7 * day)
        let dayC = diffValue / day
        let hourC = diffValue / hour
        let minC = diffValue / minute
        let result = ''
        if (yearC >= 1) {
          if (parseInt(yearC) > 1) {
            result = "" + parseInt(yearC) + " years ago"
          } else {
            result = "" + parseInt(yearC) + " year ago"
          }
        } else if (monthC >= 1) {
          if (parseInt(monthC) > 1) {
            result = "" + parseInt(monthC) + " months ago"
          } else {
            result = "" + parseInt(monthC) + " month ago"
          }
        } else if (weekC >= 1) {
          if (parseInt(weekC) > 1) {
            result = "" + parseInt(weekC) + " weeks ago"
          } else {
            result = "" + parseInt(weekC) + " week ago"
          }
        } else if (dayC >= 1) {
          if (parseInt(dayC) > 1) {
            result = "" + parseInt(dayC) + " days ago"
          } else {
            result = "" + parseInt(dayC) + " day ago"
          }
        } else if (hourC >= 1) {
          if (parseInt(hourC) > 1) {
            result = "" + parseInt(hourC) + " hours ago"
          } else {
            result = "" + parseInt(hourC) + " hour ago"
          }
        } else if (minC >= 1) {
          if (parseInt(minC) > 1) {
            result = "" + parseInt(minC) + " minutes ago"
          } else {
            result = "" + parseInt(minC) + " minute ago"
          }
        }
        return result;
      },
      dateFormat(value) {
        let date = new Date(value);
        let Y = date.getFullYear();
        let m = date.getMonth() + 1;
        let d = date.getDate();
        let H = date.getHours();
        let i = date.getMinutes();
        let s = date.getSeconds();
        if (m < 10) {
          m = '0' + m;
        }
        if (d < 10) {
          d = '0' + d;
        }
        if (H < 10) {
          H = '0' + H;
        }
        if (i < 10) {
          i = '0' + i;
        }
        if (s < 10) {
          s = '0' + s;
        }
        let t = d + '-' + m + '-' + Y + '  ' + H + ':' + i + ':' + s;
        return t;
      },
      //价格格式化
      regexNum(v, len, split) {
        split = split || ',', len = Math.abs((+len) % 20 || 2)
        v = parseFloat((v + '').replace(/[^\d\.-]/g, '')).toFixed(len) + ''
        v = parseFloat(v) + ''
        return v.replace(/\d+/, function (v) {
            var lit = v.length % 3 == 0
            var index = lit ? v.length - 3 : -1
            return v.split('').reverse().join('').replace(/\d{3}/g, function (k, l) {
              return k + ((l == index && lit) ? '' : split)
            }).split('').reverse().join('')
          }
        )
      },
      //
      formatPropertyData(obj) {
        let temp = [];
        for (let i = 0; i < obj.length; i++) {
          //propertyId
          temp[obj[i].id] = '';
        }
        this.otherForm = temp
      },
      //获取规格数据
      getPropertyData(res) {
        let catId = res ? res : this.categoryId
        for (let i = 0; i < this.categoryData.length; i++) { // 属性层级一
          if ((catId === this.categoryData[i].id) && this.categoryData[i].properties) {
            this.formatPropertyData(this.categoryData[i].properties);
            this.propertyData = this.categoryData[i].properties;
          } else {
            if (this.categoryData[i].children.length > 0) {
              for (let j = 0; j < this.categoryData[i].children.length; j++) {  // 属性层级二
                if ((catId === this.categoryData[i].children[j].id) && this.categoryData[i].children[j].properties) {
                  this.formatPropertyData(this.categoryData[i].children[j].properties);
                  this.propertyData = this.categoryData[i].children[j].properties;
                } else {
                  if (this.categoryData[i].children[j].children.length > 0) {
                    for (let k = 0; k < this.categoryData[i].children[j].children.length; k++) {  // 属性层级三
                      if ((catId === this.categoryData[i].children[j].children[k].id) && this.categoryData[i].children[j].children[k].properties) {
                        this.formatPropertyData(this.categoryData[i].children[j].children[k].properties);
                        this.propertyData = this.categoryData[i].children[j].children[k].properties;
                      }
                    }
                  }
                }
              }
            }
          }
        }
      },
      approve() {
        this.loading = true
        let config = {
          'Content-Type': 'multipart/form-data'
        }
        let params = qs.stringify({id: this.adID})
        verifyApprove(params, config).then(res => {
          this.loading = false
          if (res.data.errorID == 0) {
            this.messageToastSuccess('Approve Success')
          }
          else {
            this.messageToastWarning(res.data.message)
          }
          // 上传成功 判断是从view来的单条数据还是从verificationindex来的多条数据 如果是前者 跳转到shopAdIndex页面
          if (this.goodsId) {
            this.$router.replace('/shopAdIndex')
          }
          // 如果是后者 请求下一条数据
          else {
            this.initForm()
          }
        })
          .catch(error => {
            this.loading = false
            this.messageToastErr('Error, Please Try Again Later')
            console.log(error)
          })
      },
      reject() {
        this.$refs['ruleForm'].validate((valid) => {
          if (valid) {
            this.loading = true
            let config = {
              'Content-Type': 'multipart/form-data'
            }
            //遍历这个数组，把不为空的值拼接成一个字符串
            let reasonStr = ''
            this.uploadForm.reasonArr.forEach(item => {
              if (item) {
                reasonStr += item + ','
              }
            })
            // 删掉字符串最后一位的逗号
            let finalStr = reasonStr.slice(0, reasonStr.length - 1)
            let params = {
              reason: finalStr,
              id: this.adID,
              notes: this.$translateLang(this.uploadForm.notes || '', 'zawgyiTounicode') || ''
            }
            params = qs.stringify(params)
            verifyReject(params, config).then(res => {
              this.loading = false
              if (res.data.errorID === 0) {
                this.messageToastSuccess('reject Success')
              }
              else {
                this.messageToastWarning(res.data.message)
              }
              if (this.goodsId) {
                this.$router.replace('/shopAdIndex')
              }
              else {
                this.initForm()
              }
            })
              .catch(error => {
                this.loading = false
                this.messageToastErr('Error, Please Try Again Later')
                console.log(error)
              })
          }
          else {
            this.messageToastErr('Please Select Reject Reasons')
          }
        })
      },
      notSure() {
        this.loading = true
        let config = {
          'Content-Type': 'multipart/form-data'
        }
        let params = qs.stringify({id: this.adID})
        verifyNotSure(params, config).then(res => {
          this.loading = false
          if (res.data.errorID === 0) {
            this.messageToastSuccess('Not Sure Success')
          }
          else {
            this.messageToastWarning(res.data.message)
          }
          if (this.goodsId) {
            this.$router.replace('/shopAdIndex')
          }
          else {
            this.initForm()
          }
        })
          .catch(error => {
            this.loading = false
            this.messageToastErr('Error, Please Try Again Later')
            console.log(error)
          })
      },
      //数据接口和数据结构不同 所以重新写了一个初始化数据的方法
      initGoodsVerify() {
        this.loading = true
        let params = {
          goodsId: this.$route.query.goodsId,
          verificationStatus: this.$route.query.verificationStatus,
          status: this.status
        }
        getVerifyDataById(qs.stringify(params)).then(res => {
          this.loading = false
          // 拿到新数据后页面置顶
          window.scrollTo(0, 0);
          if (res.data.errorID === 0) {
            let obj = res.data.object
            //图片初始化
            this.showPhoto = [
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
              {url: '', id: ''},
            ],
              obj.images.forEach(item => {
                this.showPhoto[item.sequence].url = item.url
              })
            this.formData.title = obj.title
            //价格初始化
            this.formData.price = obj.price ? this.regexNum(obj.price) : ''
            this.formData.priceType = obj.priceType === 1 ? 'Kyat' : 'Lakh'
            //日期初始化
            this.formData.date = this.getDateDiff(obj.createDatetime)
            this.formData.condition = obj.condition === 0 ? 'New' : 'Used'
            this.formData.brand = obj.brand
            this.formData.adDescription = obj.desc
            //分类初始化
            let categoryName = obj.category.categoryName
            let categoryArr = categoryName.split('/')
            this.formData.firstCategory = categoryArr[0] || ''
            this.formData.secondaryCategory = categoryArr[1] || ''
            this.formData.thirdCategory = categoryArr[2] || ''
            //区域初始化
            this.formData.regionId = obj.regionId
            this.getTownships()
            this.formData.townshipId = obj.townshipId
            //规格初始化
            this.getPropertyData(obj.categoryId)
            obj.values.forEach(item => {
              this.otherForm[item.propertyId] = item.text
            })
            //用户信息初始化
            this.formData.userName = obj.sellerInfo.name
            this.formData.userDescription = obj.sellerInfo.description
            //id初始化
            this.adID = obj.id
            //初始化reject表单
            this.uploadForm = {
              reasonArr: [],
              notes: '',
            }
          }
          else {
            // this.messageToastWarning(res.data.message)
            if (this.goodsId) {
              this.$router.replace('/shopAdIndex')
            }
            else {
              this.$router.replace('/verificationIndex')
            }
          }
        })
          .catch(error => {
            this.loading = false
            console.log(error)
          })
      },
      showBigImage(url) {
        this.showMask = true
        this.bigImageUrl = url
      },
    },
    filters: {

    },
    mounted() {
      if (this.$route.query.verificationStatus) {
        this.verificationStatus = this.$route.query.verificationStatus
      }
      if (this.$route.query.status) {
        this.status = this.$route.query.status
      }
      //如果是获取单个商品的数据 就使用单个商品初始化的方法
      if (this.$route.query.goodsId) {
        this.goodsId = this.$route.query.goodsId
        this.initGoodsVerify()
      }
      else {
        this.initForm()
      }
    },
  }
  ;
</script>

<style scoped>
  .image-wraper {
    margin: 20px 0;
  }

  .image-box {
    display: inline-block;
    border: solid 1px black;
    width: 120px;
    height: 120px;
    border-radius: 10px;
    cursor: pointer;
    margin-left: 5px;
  }

  .image-box img {
  }

  .verify-outwraper {
    width: 100%;
    font-family: "Microsoft YaHei";
    padding: 20px 0 0 20px;
    position: relative;
    z-index: 100;
  }

  .menu {
    color: rgb(121, 121, 121);
    font-size: 20px;
    display: inline-block;
    width: 300px;
  }

  .menu-data-price {
    color: rgb(219, 55, 67);
    font-size: 25px;
    display: inline-block;
    width: 500px;
    word-break: break-all;
    vertical-align: top;
  }

  .menu-price {
    color: rgb(219, 55, 67);
    font-size: 25px;
    display: inline-block;
    width: 55px;
  }

  .menu-data {
    font-size: 20px;
  }

  .menu-data-category {
    color: rgb(0, 0, 0);
    margin-left: 305px;
    font-size: 20px;
  }

  .menu-data-date {
    color: rgb(161, 161, 161);
    margin-left: 50px;
  }

  .menu-data-title {
    font-size: 20px;
    display: inline-block;
    width: 600px;
    word-break: break-all;
    vertical-align: top;
    line-height: 36px;
  }

  .menu-data-desc {
    display: inline-block;
    font-size: 20px;
    width: 600px;
    word-break: break-all;
    vertical-align: top;
  }

  .verify-table {
    margin-top: 20px;
  }

  .nav-bar {
    color: rgb(14, 108, 156);
    font-size: 20px;
    text-decoration: underline;
    margin: 20px 0 40px 0;
    cursor: pointer;
    user-select: none;
    display: inline-block;
  }

  .pageDisable {
    color: rgba(14, 108, 156, .5) !important;
    cursor: not-allowed !important;
  }

  .menu-row {
    margin: 5px 0;
  }

  .mask {
    position: absolute;
    z-index: 2100;
    background-color: rgba(33, 33, 33, .2);
    margin: 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-transition: opacity .3s;
    transition: opacity .3s;
  }

  .big-image {
    position: absolute;
    left: 50%;
    top: 500px;
    transform: translate(-50%, -50%);
    width: 800px;
    height: 600px;
    z-index: 2200;
  }

  .total-wraper {
    position: relative;
    width: 100%;
  }

  .reported-by {
    font-size: 18px;
    color: rgb(219, 55, 67);
    margin: 0;
  }

  .reported-title {
    font-size: 20px;
    margin: 10px 0;
    font-weight: 600;
  }

  .reported-date {
    font-size: 18px;
  }

</style>
